﻿<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
<%@ Import Namespace="Microsoft.SharePoint.ApplicationPages" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Home.aspx.cs" Inherits="Easy.UserManager.Layouts.Easy.UserManager.Home" DynamicMasterPageFile="~masterurl/default.master" %>

<asp:Content ID="PageHead" ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">

    <link rel="stylesheet" href="easy.usermanager.css" type="text/css" />
    <link rel="stylesheet" href="easy.stickypost.css" type="text/css" />
    <link rel="stylesheet" href="jquery-ui/jquery-ui.min.css" type="text/css" />
    <link rel="stylesheet" href="jquery-ui/jquery-ui.theme.min.css" type="text/css" />
    <link rel="stylesheet" href="jquery.dataTables/css/jquery.dataTables.min.css" type="text/css" />
    <link rel="stylesheet" href="jquery.dataTables/css/jquery.dataTables_themeroller.css" type="text/css" />
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" type="text/css" />


    <script type="text/javascript" src="/_layouts/15/ScriptResx.ashx?culture=en%2Dus&name=SP%2ERes"></script>
    <script type="text/javascript" src="/_layouts/15/MicrosoftAjax.js"></script>
    <script type="text/javascript" src="/_layouts/15/init.js"></script>
    <script type="text/javascript" src="/_layouts/15/1033/initstrings.js"></script>
    <script type="text/javascript" src="/_layouts/15/1033/strings.js"></script>
    <script type="text/javascript" src="/_layouts/15/core.js"></script>
    <script type="text/javascript" src="/_layouts/15/clienttemplates.js"></script>
    <script type="text/javascript" src="/_layouts/15/clientforms.js"></script>
    <script type="text/javascript" src="/_layouts/15/clientpeoplepicker.js"></script>
    <script type="text/javascript" src="/_layouts/15/autofill.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.init.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.core.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.ui.dialog.js"></script>

    <script type="text/javascript">window.jQuery || document.write('<script src="//code.jquery.com/jquery-1.10.2.min.js">\x3C/script>')</script>
    <script type="text/javascript" src="jquery-ui/jquery-ui.min.js"></script>
    <script type="text/javascript" src="jquery.dataTables/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="easy.usermanager.js"></script>
    <script type="text/javascript" src="easy.stickypost.js"></script>
    <script type="text/javascript">

        $(document).ready(function () {
            InitEasyApplication(true);
            $(".easy-application").stickypost();
        });


    </script>

</asp:Content>

<asp:Content ID="Main" ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <div class="easy-application">
        <div class="easy-container">
            <div class="easy-row">
                <div class="col-md-12">
                    <div>
                        <ul class="nav nav-tabs" id="easy-tabs">
                            <li role="presentation" data-tabid="UserTab" class="active"><a href="#UserTab">User</a></li>
                            <li role="presentation" data-tabid="GroupTab"><a href="#GroupTab">Group</a></li>
                            <li role="presentation" data-tabid="ReportTab"><a href="#ReportTab">Report</a></li>
                            <li role="presentation" data-tabid="LogTab"><a href="#LogTab">Log</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="easy-row" data-tab="UserTab">
                <div class="col-md-12">
                    <div data-stickyid="1">
                        <a href="javascript:document.getElementById('search_siteusers_input').focus();">Type in</a> the user name or email to view users' profile, membership, or assign them to a group...
                    </div>
                    <div data-stickyid="2">
                        To add user to group, you must first search the user and subsequently select a group in the drop down list.
                    </div>
                    <input id="search_siteusers_input" type="text" placeholder="search for someone.."
                        onkeydown="OnKeyDownSearchSiteInfoUser(event);return (event.keyCode != 13);"></input>
                </div>
                <div class="col-md-12 searchcontainer">
                    <div id="searchResultMode">
                        <input type="radio" id="search_mode_tile" name="searchResultMode" checked="true" title="Tile View" onclick="SelectSearchResultMode()" />
                        <label for="search_mode_tile"><i class="fa fa-2x fa-th"></i></label>
                        <input type="radio" id="search_mode_list" name="searchResultMode" title="List View" onclick="SelectSearchResultMode()" />
                        <label for="search_mode_list"><i class="fa fa-2x fa-bars"></i></label>
                    </div>
                    <div id="searchResultSort">
                        <input type="radio" id="search_sort_asc" name="searchResultSort" checked="true" title="Name Ascending" onclick="SelectSearchResultSort()" />
                        <label for="search_sort_asc"><i class="fa fa-2x fa-sort-alpha-asc"></i></label>
                        <input type="radio" id="search_sort_des" name="searchResultSort" title="Name Descending" onclick="SelectSearchResultSort()" />
                        <label for="search_sort_des"><i class="fa fa-2x fa-sort-alpha-desc"></i></label>
                    </div>
                    <div id="searchResultGroup">
                        <label for="searchGroup" class="combo-label">Select a Group: </label>
                        <input id="searchGroup" type="text" disabled />
                        <div class='comboclear' onclick="ClearCombo('searchGroup');"><i class='fa fa-times'></i></div>
                    </div>
                    <ul id="searchResult" class="selectable sortable">
                    </ul>
                    <div id="searchResultInfo">
                        <div data-stickyid="3"><i><b>Ctrl + Left Click</b> to select mutiple users. <b>Right Click</b> to access more features.</i></div>
                    </div>
                </div>
            </div>
            <div class="easy-row" data-tab="GroupTab">
                <div class="col-md-12" id="stats_group">
                    <div>
                        You have: <span class='indicator' id='unviewable_indicator'></span>unviewable group(s). <span class='indicator' id='unmanageable_indicator'></span>unmanageable group(s).   
					<span class="indicator" onclick="OpenCreateGroupWindow();"><i class="fa fa-plus"></i>Create a group</span>
                    </div>
                </div>
                <div class="col-md-12 dragcontainer">
                    <div id="dragAndDropMode">
                        <input type="radio" id="mode_move" name="dragAndDropMode" checked="true" onclick="SelectDragMode()" /><label for="mode_move">Move</label>
                        <input type="radio" id="mode_copy" name="dragAndDropMode" onclick="SelectDragMode()" /><label for="mode_copy">Copy</label>
                    </div>
                    <div id="dragAndDropInfo">
                        <div data-stickyid="4">You can drag a user by clicking and holding the <i class="fa fa-arrows"></i>and move to the other side of the group.</div>
                    </div>
                </div>
                <div class="col-md-6 groupcontainer">
                    <div class="groupcombo">
                        <label for="source" class="combo-label">Source<span class="ms-accentText" title="Please select a group to edit"> *</span>: </label>
                        <input id="source" type="text" data-connectto="listA" disabled />
                        <div class='comboclear' onclick="ClearCombo('source');"><i class='fa fa-times'></i></div>
                    </div>
                    <div class="groupsearch">
                        <label for="search_listA" class="search-label">Find :</label>
                        <input type="text" id="search_listA" onkeyup="SearchClientSiteGroupMembers('listA',this.value);" />
                    </div>
                    <div class='groupsetting' title="Group Setting" onclick="OpenSourceSetting();"><i class="fa fa-2x fa-cog"></i></div>
                    <div class='grouppermission' title="View Group Permission" onclick="OpenSourcePermission();"><i class="fa fa-2x fa-users"></i></div>
                    <div class='grouprefresh' title="Refresh" onclick="RefreshSourceGroup();"><i class='fa fa-2x fa-refresh'></i></div>
                    <div id="source_group" class="groupHolder">
                        <ul id="listA" class="selectable sortable">
                        </ul>
                    </div>
                </div>
                <div class="col-md-6 groupcontainer">
                    <div class="groupcombo">
                        <label for="target" class="combo-label">Target<span class="ms-accentText" title="Please select a group to edit"> *</span>: </label>
                        <input id="target" type="text" data-connectto="listB" disabled />
                        <div class="comboclear" onclick="ClearCombo('target');"><i class='fa fa-times'></i></div>
                    </div>
                    <div class="groupsearch">
                        <label for="search_listB" class="search-label">Find :</label>
                        <input type="text" id="search_listB" onkeyup="SearchClientSiteGroupMembers('listB',this.value);" />
                    </div>
                    <div class='groupsetting' title="Group Setting" onclick="OpenTargetSetting();"><i class="fa fa-2x fa-cog"></i></div>
                    <div class='grouppermission' title="View Group Permission" onclick="OpenTargetPermission();"><i class="fa fa-2x fa-users"></i></div>
                    <div class='grouprefresh' title="Refresh" onclick="RefreshTargetGroup();"><i class='fa fa-2x fa-refresh'></i></div>
                    <div id="target_group" class="groupHolder">
                        <ul id="listB" class="selectable sortable">
                        </ul>
                    </div>
                </div>
                <div class="col-md-12 inputcontainer">
                    <h3>Add Multiple Members</h3>
                    <div id="peoplePickerDiv"></div>
                    <input class="addfunction" id="add_to_source" type="button" value="Add to Source" disabled
                        onclick="AddToSource_Click()" />
                    <input class="addfunction" id="add_to_target" type="button" value="Add to Target" disabled
                        onclick="AddToTarget_Click()" />
                    <div id="peoplePickerMsg"></div>
                </div>
            </div>
            <div class="easy-row" data-tab="ReportTab">
                <div class="col-md-12">
                    <span class='indicator' onclick="DownloadReport(0)"><i class="fa fa-download"></i>Group/Member Report</span>
                    <div data-stickyid="5">
                        This report generates a list of groups with group member that you can manage.
                    </div>
                    <span class='indicator' onclick="DownloadReport(1)"><i class="fa fa-download"></i>Access Matrix Report</span>
                    <div data-stickyid="6">
                        This report generates a list of permsision for your current site, lists and document libraries..
                    </div>
                </div>
            </div>
            <div class="easy-row" data-tab="LogTab">
                <div class="col-md-12 consolecontainer">
                    <div data-stickyid="7">
                        This log is auto generated based on your action done on other tabs...
                    </div>
                    <div id="console">
                    </div>
                    <div id="consoleFunction">
                    </div>
                </div>
            </div>
        </div>
    </div>
</asp:Content>

<asp:Content ID="PageTitle" ContentPlaceHolderID="PlaceHolderPageTitle" runat="server">
    Easy User Manager
</asp:Content>

<asp:Content ID="PageTitleInTitleArea" ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
    Easy User Manager
</asp:Content>
